﻿@{
    Layout = "/Views/Shared/_Layout.cshtml";
    var user = (UserInfo)Model;
}

<style type="text/css">
    * {
        margin: 0;
        padding: 0;
    }

    input, button, a {
        outline: none;
    }

    html, body {
        height: 100%;
    }
    /*::-webkit-scrollbar{
          display:none;
        }*/

    .bgimg {
        height: 100%;
        width: 100%;
        background: url(/Assets/Images/all.png) no-repeat;
    }
    /*侧边栏*/
    .left {
        width: 4%;
        height: 100%;
        background-color: #32323a;
        float: left;
    }

        .left .logo {
            background-color: #393941;
            height: 55px;
            width: 100%;
            background-image: url(/Assets/Images/logo_1.png);
            background-repeat: no-repeat;
            background-size: 80%;
            background-position: 5px;
        }
    /*公链展示*/
    .right {
        width: 96%;
        height: 100%;
        float: left;
        color: white;
    }

        .right .top {
            height: 55px;
            width: 100%;
            background-color: rgba(6,142,220,0.9);
            font-size: 16px;
        }

            .right .top img {
                margin-right: 10px;
            }

            .right .top .user {
                width: 145px;
                height: 100%;
                float: left;
                margin-left: 60px;
                line-height: 55px;
            }

            .right .top .checkout {
                width: 105px;
                height: 100%;
                float: right;
                margin-right: 40px;
                line-height: 55px;
            }
        /*内容*/
        .right .middle .contant {
            width: 90%;
            margin: 30px auto 0;
        }

            .right .middle .contant .title {
                border-bottom: 3px solid rgb(6,142,220);
                padding-bottom: 5px;
                font-size: 26px;
                width: fit-content;
                color: white;
                font-weight: bold;
                margin-bottom: 20px;
                text-align: left;
            }

    .search {
        width: 100%;
        height: 45px;
        margin-bottom: 20px;
    }

    .searchleft {
        float: left;
        width: 500px;
    }

        .searchleft .input {
            width: 100%;
            font-size: 16px;
        }

            .searchleft .input input {
                width: 350px;
                /*border: 1px solid rgb(6,142,220);*/
                background-color: rgba(0,0,0,0);
                color: white;
                height: 35px;
                /*border-radius: 5px;*/
                padding-left: 10px;
            }

    .searchright {
        float: right;
        width: 425px;
    }

        .searchright .type {
            width: 100%;
            font-size: 16px;
        }

            .searchright .type select {
                width: 285px;
                border: 1px solid rgb(6,142,220);
                background-color: rgba(0,0,0,0);
                color: white;
                padding: 0 0 0 10px;
                /*border-radius: 5px;*/
                position: relative;
                bottom: 5px;
            }
    /*新建任务*/
    @@media screen and (max-height: 940px) {
        .project {
            height: 470px;
        }
    }

    @@media screen and (min-height: 941px) {
        .project {
            height: 680px;
        }
    }

    .project {
        overflow: scroll;
        overflow-x: hidden;
    }

        .project::-webkit-scrollbar { /*滚动条整体样式*/
            width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
            height: 4px;
        }

        .project::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
            border-radius: 5px;
            -webkit-box-shadow: inset 0 0 5px rgba(255,255,255,0.2);
            background: rgba(255,255,255,0.2);
        }

        .project::-webkit-scrollbar-track { /*滚动条里面轨道*/
            -webkit-box-shadow: inset 0 0 5px rgba(255,255,255,0.2);
            border-radius: 0;
            background: rgba(255,255,255,0.2);
        }

        .project .same {
            margin-top: 20px;
            width: 100%;
        }

            .project .same:first-child {
                margin-top: 0px;
            }

            .project .same .head {
                height: 53px;
                width: 100%;
                background-color: rgba(49,49,60,0.8);
                border-radius: 10px 10px 0 0;
                line-height: 53px;
            }

                .project .same .head .number {
                    height: 35px;
                    width: 35px;
                    background-color: rgb(6,142,220);
                    text-align: center;
                    border-radius: 5px;
                    font-size: 16px;
                    line-height: 35px;
                    float: left;
                    position: relative;
                    top: 8px;
                    left: 40px;
                }

                .project .same .head .icon {
                    height: 30px;
                    width: 30px;
                    float: right;
                    margin-right: 30px;
                }

                    .project .same .head .icon img {
                        height: 100%;
                        width: 100%;
                    }

            .project .same .inform {
                height: 267px;
                width: 100%;
                background-color: rgba(64,62,79,0.8);
                border-radius: 0px 0px 10px 10px;
                padding: 30px 0px 0 50px;
                font-size: 16px;
            }

    .inform > div {
        margin-bottom: 35px;
    }

        .inform > div input {
            width: 420px;
            height: 35px;
            background-color: rgba(0,0,0,0);
            /*border: 2px solid #b3b3b8;*/
            /*border-radius: 5px;*/
        }

    ::-webkit-inner-spin-button {
        visibility: hidden;
    }
    /*这是控制上下小箭头的*/
    ::-webkit-calendar-picker-indicator { /*这是控制下拉小箭头的*/
        border: 1px solid #ccc;
        border-radius: 2px;
        box-shadow: inset 0 1px #fff, 0 1px #eee;
        background-color: #eee;
        background-image: -webkit-linear-gradient(top, #f0f0f0, #e6e6e6);
        color: #666;
        margin-right: 10px;
    }

    .inform .pro input {
        padding-left: 10px;
    }

    .qualified {
        width: 300px;
        height: 35px;
    }

        .qualified div {
            float: left;
        }

        .qualified .select {
            width: 135px;
            height: 100%;
            line-height: 35px;
            text-align: center;
            margin-left: 8px;
            cursor: pointer;
        }

        .qualified .yes {
            background-color: #06a4fc;
            height: 100%;
            width: 50%;
            border-radius: 5px 0px 0px 5px;
        }

    .contrary-yes {
        border: 1px solid #ff455f;
        height: 100%;
        width: 50%;
        border-radius: 5px 0px 0px 5px;
    }

    .qualified .no {
        border: 1px solid #06a4fc;
        height: 100%;
        width: 50%;
        border-radius: 0px 5px 5px 0px;
    }

    .contrary-no {
        background-color: #ff455f;
        height: 100%;
        width: 50%;
        border-radius: 0px 5px 5px 0px;
    }

    .up {
        width: 400px;
        height: 40px;
        margin-top: 20px;
        float: left;
    }

        .up input {
            float: left;
        }

    .post {
        width: 270px;
        height: 40px;
        background-color: #06a4fc;
        float: right;
        margin-top: 20px;
        line-height: 40px;
        text-align: center;
        border-radius: 5px;
        font-size: 16px;
    }

    .display {
        display: none;
    }

    .displayed {
        display: none;
    }


    input {
        border-top: none;
        border-left: none;
        border-right: none;
    }
</style>

<body>
    <div class="bgimg">
        <div class="left">
            <div class="logo"></div>
        </div>
        <div class="right">
            <div class="top">
                <div class="user">
                    <img class="user-img" src="/Assets/Images/touxiang.png" />
                    <span class="txt">欢迎登录</span>
                </div>
                <div class="checkout">
                    <img class="checkout-img" src="/Assets/Images/fytuichu.png" />
                    <span class="txt" onclick="LoginOut()">退出</span>
                </div>
            </div>

            <form action="/Show/Add" method="post" enctype="multipart/form-data" id="form">
                <div class="middle">
                    <div class="contant">
                        <div class="title">
                            @user.account
                        </div>
                        <div class="search">
                            <div class="searchleft">
                                <div class="input">
                                    <label>
                                        送检单位：
                                        <input type="text" name="Mechanism" placeholder="请输入送检单位" required="required">
                                        <input type="hidden" name="TestMechanism" readonly="readonly" value="@(user.account)">
                                    </label>
                                </div>
                            </div>
                            <div class="searchright">
                                <div class="type">
                                    <label>
                                        <div style="float: left;">检测类型：</div>
                                        <select style="float: left; background: #06102c; border: none; border-bottom: 1px solid;" name="Type" class="form-control">
                                            <option value="0">实验室</option>
                                            <option value="1">电站</option>
                                            <option value="2">监造</option>
                                        </select>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="project" id="divplan" style="width: 96%">
                            <div class="same">
                                <div class="head">
                                    <div class="number">
                                        1
                                    </div>
                                    <div class="icon">
                                        <img class="tianjia displayed" src="/Assets/Images/tianjia.png" onclick="adddiv(this)" />
                                        <img class="shanchu" src="/Assets/Images/shanchu.png" onclick="removediv(this)" />
                                    </div>
                                </div>
                                <div class="inform">
                                    <div class="pro">
                                        <label>
                                            检测项目：
                                            <input type="text" name="Project">
                                        </label>
                                    </div>
                                    <div class="qualified">
                                        <div class="txt" style="line-height: 35px">
                                            是否合格：
                                        </div>
                                        <div class="select">
                                            <div class="yes" onclick="yes(this)">
                                                合格
                                            </div>
                                            <div class="no" onclick="no(this)">
                                                不合格
                                            </div>
                                            <input type="hidden" name="IsQualified" value="1">
                                        </div>
                                    </div>
                                    <div class="input-daterange time">
                                        完成时间：
                                        <input type="date" name="SuceessTime">
                                    </div>
                                </div>
                            </div>
                            <div class="same" id="div">
                                <div class="head">
                                    <div class="number">
                                        2
                                    </div>
                                    <div class="icon">
                                        <img class="tianjia " src="/Assets/Images/tianjia.png" onclick="adddiv(this)" />
                                        <img class="shanchu displayed" src="/Assets/Images/shanchu.png" onclick="removediv(this)" />
                                    </div>
                                </div>
                                <div class="inform">
                                    <div class="pro">
                                        <label>
                                            检测项目：
                                            <input type="text" name="Project">
                                        </label>
                                    </div>
                                    <div class="qualified">
                                        <div class="txt" style="line-height: 35px">
                                            是否合格：
                                        </div>
                                        <div class="select">
                                            <div class="yes" onclick="yes(this)">
                                                合格
                                            </div>
                                            <div class="no" onclick="no(this)">
                                                不合格
                                            </div>
                                            <input type="hidden" name="IsQualified" value="1">
                                        </div>
                                    </div>
                                    <div class="input-daterange time">
                                        完成时间：
                                        <input type="date" name="SuceessTime">
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="submit">
                            <div class="up">
                                <div class="" style="float: left; font-size: 16px; line-height: 27px;">
                                    报告原件：
                                </div>
                                <input type="file" name="FilePath" accept=".xls,.doc,.pdf">
                            </div>
                            @*<div class="post">
                                    提交入链
                                </div>*@
                            <button type="submit" class="post" value="" style="width: 200px; margin-left: 22%; margin-top: 20px;border: none" onclick="return check()">提交入链</button>
                        </div>
                    </div>
                </div>

            </form>
        </div>
    </div>
</body>

@*<form action="/Show/Add" method="post" enctype="multipart/form-data">
        <h2 style="text-align: left">
            @user.Account
        </h2>
        送检单位:<input type="text" name="Mechanism">
        检测机构:<input type="text" name="TestMechanism" readonly="readonly" value="@(user.Account)">
        检测类型:
        <select name="Type">
            <option value="0">实验室</option>
            <option value="1">电站</option>
            <option value="2">监造</option>
        </select>
        <div id="divplan">
            <div id="div">
                <i onclick="adddiv(this)">新增</i>
                检测项目：<input type="text" name="Project">
                是否合格：<input type="text" name="IsQualified" value="1">

                完成时间：<input type="date" name="SuceessTime">
            </div>
        </div>
        报告原件:<input type="file" name="FilePath">


        <button type="submit" value="" style="width: 100px; margin-left: 22%; margin-top: 20px;">提交</button>
    </form>*@
<script>
    //复制div
    function adddiv(thisi) {
        $(thisi).hide();
        $(thisi).siblings(".shanchu").show();
        $("#divplan").append("<div class=\"same\">" + $(".same:last").html() + "</div>");
        $(".icon:last").children(".shanchu").hide();
        $(".icon:last").children(".tianjia").show();
        var val = parseInt($(".number:last").text()) + 1;
        $(".number:last").text(val);
    }

    //删除div
    function removediv(thisi) {
        $(thisi).parents(".same").remove();
        //重新排序时间
        $.each($(".number"), function (n, value) {
            $(this).text(n + 1);
        });
    }

    //yes
    function yes(btn) {
        $(btn).siblings("input").val(1);
        $(btn).attr("class", "yes");
        $(btn).siblings("div").attr("class", "no");
    }
    //no
    function no(btn) {
        $(btn).siblings("input").val(0);
        $(btn).attr("class", "contrary-no");
        $(btn).siblings("div").attr("class", "contrary-yes");

    }
    //提交
    function check() {
        var Mechanism = $("input[name='Mechanism']").val();
        if (Mechanism == "" || Mechanism == null) {
            alert("请输入送检单位");
            return false;
        }
        var index = 1;
        var index1 = 1;
        var b = true;
        var b1 = true;
        $("input[name='Project']").each(function () {
            var value = $(this).val();
            //alert(value);
            //console.log(value);
            if (value == "" || value == null) {
                alert("第" + index + "项，检测项目名称为空");
                b = false;
                return false;
            }
            index++;
        });
        if (!b) {
            return false;
        }



        $("input[name='SuceessTime']").each(function () {
            var value = $(this).val();
            //alert(value);
            //console.log(value);
            if (value == "" || value == null) {
                alert("第" + index1 + "项，完成时间为空");
                b1= false;
                return false;;
            } else {
                //验证为时间


            }
            index1++;
        });
        if (!b1) {
            return false;
        }
        return true;
    }
</script>
